//运营管理 - 流量分单设置

import React, { Component } from 'react';
import { LocaleProvider, Icon, Button, Table, Tag } from 'antd';
import zh_CN from 'antd/lib/locale-provider/zh_CN';

const { Column } = Table;

const data = [];
for (let i = 0; i < 50; i++) {
  data.push({
    key: i,
    partment: `审核部门${i}`,
    manager: '朱杰',
    auditor: '于宇、程焦、李婧琪、王梓懿',
    weight: 1,
    count: 1,
    MachineAuditTime: '-',
    MachineAuditMoney: 0,
    cz: ['审核设置', '机审放款设置']
  });
}

const pagination = {
	total: 50,
	className: 'pagination-position',
	showSizeChanger: true,
	showQuickJumper: true,
	showTotal: (total) => {
    return `共 ${total} 条`;
  }
}

class Traffic extends Component {
  setRowClassName = (record, index) => {
    return index % 2 === 0 ? 'row-white' : 'row-grey';
  }

	render() {
		return (
      <LocaleProvider locale={zh_CN}>
        <div className="apply">
          <div>
            <div>
              <Icon type="appstore" />
              <span className="apply-font">分单设置</span>
              <div className="btn">
                <Button icon="plus" size="small">新增</Button>
                <Button icon="redo" size="small">刷新</Button>
              </div>
            </div>
          </div>   
          <div className="line"></div>
          <div className="info-table">
            <Table size="small" className="loan-table" rowClassName={this.setRowClassName} pagination={ pagination } bordered dataSource={data}>
              <Column title='部门' align='center' dataIndex='partment' width='70' />
              <Column title='部门负责人' align='center' dataIndex='manager' width='70' />
              <Column title='审核人员' align='center' dataIndex='auditor' width='120' />
              <Column title='分单权重' align='center' dataIndex='weight' width='70' />
              <Column title='分单数量' align='center' dataIndex='count' width='70' />
              <Column title='机审时间段' align='center' dataIndex='MachineAuditTime' width='120' />
              <Column title='机审放款数' align='center' dataIndex='MachineAuditMoney' width='70' />
              <Column title='操作' align='center' dataIndex='cz' width='70' 
                render={cz => (
                  <span>
                    {<Tag color="orange" key={cz}><Icon type='edit' /></Tag>}
                    {cz.map(cz => <Tag color="blue" key={cz}>{cz}</Tag>)}
                  </span>
                )} />
            </Table>
          </div>
        </div>
      </LocaleProvider>  
		);
	}
}

export default Traffic;